<template>
	<view class="retrieve">
		<view class="seach-top">
			<view class="seach-input">
				<input v-model="orderId" @confirm="seach" type="text" value="" placeholder="请输入订单编号"/>
				<view class="seach-btn" @click="seach()">
					<text>同步</text>
				</view>
			</view>
		</view>
		<view class="order-lists" v-if="order.order_id">
			<view class="order-list">
				<view class="order-list-left">
					<image :src="order.detail.goods_img" mode="widthFix"></image>
					<text>返{{commissionAmount(order.siter_commission) || '0'}}sg</text>
				</view>
				<view class="order-list-right">
					<text class="title fex2">{{order.detail.goods_name || order.detail.shop_title}}</text>
					<view class="order-ta">
						<text>{{order.detail.goods_cate_name}}</text>
						<text>x {{order.detail.goods_ta}}</text>
					</view>
					<!-- -1未知,1待付款,2待付款,21处理中,3已发货,31配送中,32已拒签,4已收货,
					41结算中,5已结算,6失效,7已完成,8维权中,81维权成功,82维权失败,9退款,10退货,11系统锁定-->
					<view class="order-status">
						<view class="payment">
							<text>实付款:</text>
							<text>{{order.orders_price}}</text>
						</view>
						<text class="status" v-if="order.detail.dm_order_status == '-1'">未知</text>
						<text class="status" v-if="order.detail.dm_order_status == 1">待付款</text>
						<text class="status" v-if="order.detail.dm_order_status == 2">待付款</text>
						<text class="status" v-if="order.detail.dm_order_status == 21">处理中</text>
						<text class="status" v-if="order.detail.dm_order_status == 3">已发货</text>
						<text class="status" v-if="order.detail.dm_order_status == 31">配送中</text>
						<text class="status" v-if="order.detail.dm_order_status == 32">已拒签</text>
						<text class="status" v-if="order.detail.dm_order_status == 4">已收货</text>
						<text class="status" v-if="order.detail.dm_order_status == 41">结算中</text>
						<text class="status" v-if="order.detail.dm_order_status == 5">已结算</text>
						<text class="status" v-if="order.detail.dm_order_status == 6">失效</text>
						<text class="status" v-if="order.detail.dm_order_status == 7">已完成</text>
						<text class="status" v-if="order.detail.dm_order_status == 8">维权中</text>
						<text class="status" v-if="order.detail.dm_order_status == 81">维权成功</text>
						<text class="status" v-if="order.detail.dm_order_status == 82">维权失败</text>
						<text class="status" v-if="order.detail.dm_order_status == 9">退款,</text>
						<text class="status" v-if="order.detail.dm_order_status == 10">退货</text>
						<text class="status" v-if="order.detail.dm_order_status == 11">系统锁定</text>
					</view>
				</view>
			</view>
		</view>
		<view class="retrieve-order">
			<view class="title">
				<text>同步订单示例：</text>
			</view>
			<view class="content">
				<view class="step">
					打开淘客<text class="iconfont icon-jiantou"></text>
					我的淘宝<text class="iconfont icon-jiantou"></text>
					进入我的订单<text class="iconfont icon-jiantou"></text>
					找到未同步的订单<text class="iconfont icon-jiantou"></text>
					进入详情<text class="iconfont icon-jiantou"></text>
					复制订单编号
				</view>
				<text class="img-t">如图：</text>
				<image src="../../../../static/images/order.png" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {retrieveOrder} from "@/api/duomai.js"
	export default{
		name:"retrieve",
		data(){
			return{
				orderId:"",
				order:{}
			}
		},
		methods:{
			commissionAmount(val) {
				val = Math.ceil(Number(val.replace(/,/g, ''))*20);
				return val;
			},
			async seach(){
				if(!this.orderId){
					this.$msg("请输入订单")
					return;
				}
				let res = await retrieveOrder({orderId:this.orderId})
				if(res.code === 1){
					if(res.data.detail){
						let detail = JSON.parse(res.data.detail);
						if(detail.data&&detail.data.details.length){
							res.data.detail = detail.data.details[0]
							let img = res.data.detail.goods_img;
							if(img.indexOf("http") == -1 && 
							img.indexOf("https")){
								res.data.detail.goods_img = "http:"+res.data.detail.goods_img;
							}
						}
					}
					this.order = res.data;
					this.$msg(res.msg)
				}else{
					this.$msg(res.msg)
				}
			}
		}
	}
</script>

<style lang="less" scoped src="./retrieve.less">
</style>
